<template>
  <div id="app">
    <router-view></router-view>
    <sq-login-box v-if="showLoginBox" @close="toggleLoginBox"></sq-login-box>
    <sq-listen-bar v-if="showListenBar" ></sq-listen-bar>
  </div>
</template>

<script>


import Vue from 'vue';
import { mapActions, mapGetters } from 'vuex';
import LoginBox from './components/Login';
import ListenBar from './components/ListenBar';
import Cookies from 'js-cookie';
Vue.component(LoginBox.name, LoginBox);
Vue.component(ListenBar.name, ListenBar);

var isInWechat = /(micromessenger)/.test(navigator.userAgent.toLocaleLowerCase());

if(isInWechat) {
  let openId = Cookies.get('wx_open_id');
  if (!openId) {
    var redirectUri = encodeURIComponent(location.protocol + "//m.sstt.iflyvoice.com/page/wxauth/callback");
    var stateUrl = encodeURIComponent(location.href);
    var redirectUrl = "https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx2bd1ff44e2ae5766&redirect_uri=" + redirectUri + "&response_type=code&scope=snsapi_base&state=" + stateUrl + "&connect_redirect=1#wechat_redirect";
    location.href = redirectUrl;
  }
}

export default {
  name: 'app',
  created () {
      // 加载之后，刷新登录状态
      this.$store.dispatch('refreshLoginStatus');
      var reg = /from=([^&]*)/
      if(reg.test(location.href)) {
        var channel = RegExp.$1;
        this.$store.dispatch('setChannel',{
          channel
        });
      }
  },
  methods: {
    // 映射 this.toggleLoginBox() 为 this.$store.dispatch('toggleLoginBox')
    ...mapActions([
      'toggleLoginBox',
    ]),
  },
  computed: {
    ...mapGetters([
      'showLoginBox',
      'showListenBar'
    ])
  }
}
</script>

<style>

body {
	margin: 0px;
	padding: 0px;
}

#app {
  font-family: 'Avenir', Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #000000;
}

.custom-toast {
  width: 200px;
}
::-moz-focus-inner {
  border:0;
}

:focus {
  outline:none;
}
</style>
